{% extends "section.html" %}

{% block body %}
{% set page_class = "blog list" %}
{% endblock body %}

{% block header %}
{# This value is matched by the config.extra.menu.main->section #}
{% set current_section = "blog" %}
{{ macros_header::header(current_section=current_section)}}
{% endblock header %}

{% block content %}

<svg class="w-full h-full" viewBox="0 0 1512 235" fill="none" xmlns="http://www.w3.org/2000/svg">
  <path class="dark:fill-zinc-700" d="M 1512 0 V 235 H 0 L 1512 0 Z" fill="#7A1307"/>
  <path class="dark:fill-zinc-900" d="M 1512 29 V 236 H 0 L 1512 29 Z" fill="#c12110"/>
</svg>

<div class="bg-redrust dark:bg-zinc-900 text-white px-2">
      <h1 class="text-center text-3xl mb-3 font-semibold text-white">Latest Updates</h1>
      <h2 class="text-center text-xl text-red-50 mb-12">Updates and techincal articles from the team and contributors</h2>
</div>

<div class="container" role="document">
  <div class="content mx-auto max-w-[52rem] my-16">
        <div class="flex flex-col card-list gap-3">
          {% for page in paginator.pages %}
          <a class="stretched-link text-body hover:bg-gray-50 dark:hover:bg-gray-900 rounded-sm p-4" href="{{ page.permalink }}">
            <div>
              <h2 class="text-lg font-semibold  -mt-1">{{ page.title }} </h2>
              <p class="text-gray-500">{{page.description | safe }}</p>
            </div>
            <div class="flex mt-2 items-center">
              <div class="text-sm text-sky-500 font-medium">
                Read more
              </div>
              <svg class="relative mt-px overflow-visible ml-2.5 text-sky-300 dark:text-sky-700" width="3" height="6" viewBox="0 0 3 6" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M0 0L3 3L0 6"></path></svg>
            </div>
          </a>
          {% endfor %}
          {% if paginator.previous or paginator.next %}
          {{ macros_section_nav::navigation(paginator=paginator) }}
          {% endif %}
        </div>
  </div>
</div>
{% endblock content %}
